{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加文章</title>
</head>
<body>

标题：<input type="text" name="title" id="title"> <br/><br/>
<label for="content">内容：</label>
<textarea name="content" id="content" cols="50" rows="10"></textarea> <br/><br/>
<input type="submit" value="提交" id="submit_article">
<input type="submit" value="修改" id="fix_article">
<input type="submit" value="删除" id="del_article">

<h6>获取文章列表</h6>
<p id="article_list"></p>

<script src="{% static 'jQuery.js' %}"></script>
<script src="{% static 'cookie.js' %}"></script>
<script>
    let token = $.cookie('cookie_token')
    console.log("token==" + token)
    $.cookie("cookie_token", token)
    $.ajax({
        url: "{% url 'getArticle' %}",
        type: 'get',
        success: function (result) {
            console.log(typeof result)
            console.log(result)
            $("#article_list").text(result)
        }
    })

    $("#submit_article").click(function () {
        let title = $("#title").val()
        let content = $("#content").val()
        console.log(title)
        console.log(content)
        $.ajax({
            url: "{% url 'addArticle' %}",
            type: 'post',
            data:{
                title:title,
                content:content
            },
            success:function (result) {
                console.log(result)
            }
        })
    })

    $("#fix_article").click(function () {
        let title = $("#title").val()
        let content = $("#content").val()
        $.ajax({
            url:"{% url 'modifyArticle' %}",
            type:'post',
            data:{
                title:title,
                content:content
            },
            success:function (result) {
                console.log(result)
            }
        })
    })

    $("#del_article").click(function () {
        $.ajax({
            url:'{% url "delArticle" %}',
            type:'post',
            data:{
                id:4
            },
            success:function (result) {
                console.log(result)
            }
        })
    })
</script>
</body>
</html>